import Vue from 'vue'
import VueRouter from 'vue-router'
import Login from '../views/login'
import Home from '../views/home'
import Find from '../views/home/find'
import My from '../views/home/my'
import Question from '../views/home/question'
import myInfo from '../views/home/myInfo'
import EditInfo from '../views/home/editInfo'
import ShareList from '../views/home/shareList'
import Search from '../views/home/search'
import ShareDetail from '../views/home/shareDetail'
import Chart from '../views/home/chart'
import Interview from '../views/home/interview'

import { getLocal } from '../utils/local'
import { Toast } from 'vant'
import store from '../store/index'
import { getUserInfoApi } from '../api/au'

Vue.use(VueRouter)

// 路由元信息中的数据
// needLogin:判断该页面需不需要登录才能访问 true:需要登录
// needTab:判断该页面需不需要tabBar导航菜单 true:需要
const routes = [
  {
    path: '/login',
    component: Login
  },
  {
    path: '/home',
    component: Home,
    children: [
      {
        path: '/find',
        component: Find,
        meta: {
          needTab: true
        }
      },
      {
        path: '/my',
        component: My,
        meta: { needLogin: true, needTab: true }
      },
      {
        path: '/question',
        component: Question,
        meta: { needLogin: true, needTab: true }
      },
      {
        path: '/myInfo',
        component: myInfo,
        meta: { needLogin: true }
      },
      {
        path: '/editInfo',
        component: EditInfo,
        meta: { needLogin: true }
      },
      {
        path: '/shareList',
        component: ShareList
      },
      {
        path: '/search',
        component: Search
      },
      {
        // 设置动态路由,并设置必传参数id
        path: '/shareDetail/:id',
        component: ShareDetail
      },
      {
        path: '/chart',
        component: Chart
      },
      {
        path: '/interview/:city/:id',
        component: Interview,
        meta: { needLogin: true }
      }
    ]
  }
]

const router = new VueRouter({
  routes
})

const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (location, onResolve, onReject) {
  if (onResolve || onReject) {
    return originalPush.call(this, location, onResolve, onReject)
  }
  return originalPush.call(this, location).catch(err => err)
}

// 登录校验
router.beforeEach(async (to, from, next) => {
  // 保存from页面滚动条的位置,保存在路由元信息中
  from.meta.scroll =
    document.documentElement.scrollTop ||
    document.body.scrollTop ||
    window.pageYOffset

  // 判断该页面是否需要登陆才能进入
  if (to.meta.needLogin) {
    // 需要，判断用户是否登陆(用token来判断)
    if (getLocal()) {
      // 已登录,判断vuex中userInfo是否有值(判断这个的原因是：vuex中的数据一刷新就没有了，为了不让他没有，每次刷新的时候都重新获取)
      if (store.state.isLogin) {
        // 有值，正常跳转(刚登陆进来)
        next()
      } else {
        // 没有值，获取(刷新了页面)
        const res = await getUserInfoApi()
        // 将获取的用户信息保存到vuex中
        store.commit('setUserInfo', res.data)
        // 将仓库中的登录标识的值改为true
        store.commit('setIsLogin', true)
        // 跳转
        next()
      }
    } else {
      // 未登录
      // 1.提示用户
      Toast.fail('请登录')
      //  保存用户是从哪个页面跳转到登录页的路由
      // 2.返回登录页(因为路由版本问题，用next跳转到login页面时会报错，但不影响功能使用，在导航守卫前加一段代码就不会报错了)
      next('/login?pre=' + to.fullPath)
      // 跳转方式2：(正常跳转不会报错)
      /*  router.push('/login?pre=' + to.fullPath)
      next() */
    }
  } else {
    // 不需要就正常跳转
    next()
  }
})

router.afterEach((to, from) => {
  // 页面跳转的时候默认滚动条在页面的顶部
  window.scrollTo(0, 0)
})

export default router
